<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>hello_jquery</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <style type="text/css">
            .bg {
                background: #f00;
                color: #fff;
            }
        </style>
        
        <script type="text/javascript" src="jquery/jquery-1.11.3.js"></script>
        <script type="text/javascript">
//            $(document).ready(function(){
//                alert("hello jquery");
//            });
            $(function(){
                
                $("li.abc").css("color","#f00");
               //奇数偶数行不一样
               //$("#hello ul li:even").css("background","#00f").css("color","#f00");
               $("li").mouseover(setColor).mouseout(setColor);
               function setColor() {
                   $(this).toggleClass("bg");
               }
    });
        </script>
    </head>
    <body>
        <div id="hello">
            <ul>
                <li>aaaaaaaaaaa</li>
                <li>bbbbbbbbbbb</li>
                <li class="abc">ccccccccccc</li>
                <li>ddddddddddd</li>
                <li>eeeeeeeeeee</li>
            </ul>
        </div>
    </body>
</html>
